<template>
  <Table v-model:data="tableData" :create="false">
    <el-table-column prop="PipeLine.name" label="任务名" width="180" sortable/>
    <el-table-column prop="Owner.username" label="执行者" width="180"/>
    <el-table-column prop="ctime" label="运行时间" sortable/>
    <el-table-column prop="status" label="状态"/>

    <el-table-column fixed="right" label="操作" width="210" >
      <template #default="scope">
        <div class="operation">
          <el-button type="success" size="small">
            <el-icon>
              <el-tooltip content="停止任务">
                <VideoPause/>
              </el-tooltip>
            </el-icon>
          </el-button>
        </div>

      </template>
    </el-table-column>
  </Table>

  <Pagination @change="ListHisPipe" v-model:page="page"/>

</template>

<script setup lang="ts">
import {onMounted, reactive, ref} from "vue";
import {hispipe} from "./js/hispipe"
import Pagination from '@/components/common/Pagination.vue'
import Table from '@/components/common/Table.vue'

let page = reactive({"page":1,"size":15,"total":300})

const tableData = ref([])

onMounted(() => {
  ListHisPipe()
})

const ListHisPipe = async () => {
  var res = await hispipe.List(page)
  tableData.value = res.data
  page.total = res.total
}
</script>

<style scoped>
.operation > button {
  margin: 0 1px;
}
</style>